import { View, Swiper, SwiperItem } from '@tarojs/components'
import { dataListType } from 'src/types/edit-clothes'
import { useState } from 'react'
import EditClothes from '../edit-clothes'
import './index.less'

const initData: dataListType = [
    {
        name: '搭配1',
        img: [''],
        details: {
            category: {
                val: 22
            },
            season: {
                text: '季节',
                val: 3
            }
        }
    },
    {
        name: '搭配2',
        img: [''],
        details: {
            category: {
                val: 11
            },
            season: {
                val: 2
            }
        }
    }
]

type propsType = {
    data?: dataListType
}

export default function DetailCard(props: propsType) {
    const [data,] = useState(props?.data ?? initData)

    return (
        <View className='detail-card'>
            <Swiper circular className='swiper'>
                {
                    data.map((v, k) => {
                        return <SwiperItem key={k} className='swiper-item'>
                            <EditClothes data={v} />
                        </SwiperItem>
                    })
                }
            </Swiper>
        </View>
    )
}